<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>发展历程与成长时间轴</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="../../dist/css/bootstrap.min.css" rel="stylesheet">
<script src="https://code.z01.com/js/jquery-3.2.1.min.js" ></script>
<script src="../../dist/js/popper.min.js"></script>
<script src="../../dist/js/bootstrap.min.js" ></script>
<style>/*第五块发展历史*/
.home17_case_t { margin-top: 9em; margin-bottom: 4em; text-align: center; }
.home17_time { padding-top: 150px; padding-bottom: 130px; background: #f8f8f8; }
.home17_time h2 { text-align: center; color: #5d5d5d; font-weight: 100; font-size: 1.8em; }
.home17_time h3 { text-align: center; color: #848484; font-weight: 100; font-size: 0.98em; }
#timeline { position: relative; overflow: hidden; margin: 100px auto; width: 980px; height: 350px; background: url(../examples/z01/images/dot.gif) left 45px repeat-x; }
#dates { overflow: hidden; width: 980px; height: 60px; }
#dates li { float: left; width: 100px; height: 50px; background: url(../examples/z01/biggerdot.png) center bottom no-repeat; list-style: none; text-align: center; font-size: 24px; }
#dates a { padding-bottom: 10px; line-height: 38px; }
#dates .selected { font-size: 38px; }
#issues { overflow: hidden; width: 980px; height: 350px; }
#issues li { float: left; width: 980px; height: 350px; list-style: none; }
#issues li.selected img { -webkit-transform: scale(1.1, 1.1); -moz-transform: scale(1.1, 1.1); -o-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1); -ms-transform: scale(1.1, 1.1); }
#issues li img { float: left; margin: 10px 30px 10px 50px; width: 248px; background: 0 0; -webkit-transition: all 2s ease-in-out; -moz-transition: all 2s ease-in-out; -o-transition: all 2s ease-in-out; transition: all 2s ease-in-out; -webkit-transform: scale(0.7, 0.7); -moz-transform: scale(0.7, 0.7); -o-transform: scale(0.7, 0.7); transform: scale(0.7, 0.7); zoom: 1; -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)"; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF, endColorstr=#00FFFFFF);
-ms-transition: all 2s ease-in-out; -ms-transform: scale(0.7, 0.7); }
#issues li strong { line-height: 3em; color: #ffcc00; /*text-shadow:rgba(0,0,0,1.00) 1px 1px 2px; */ font-size: 1.98em; }
#issues li p { margin-right: 70px; /* text-shadow:#000 1px 1px 2px;*/ font-weight: 400; font-size: 14px; line-height: 22px; }
#grad_left, #grad_right { position: absolute; top: 0; width: 100px; height: 350px; }
#grad_left { left: 0; }
#grad_right { right: 0; }
#next, #prev { position: absolute; top: 0; top: 170px; overflow: hidden; width: 22px; height: 38px; background-position: 0 0; background-repeat: no-repeat; text-indent: -9999px; font-size: 70px; }
#next:hover, #prev:hover { background-position: 0 -76px; }
#next { right: 0; background-image: url(../examples/z01/images/home17_time_next.png); }
#prev { left: 0; background-image: url(../examples/z01/images/home17_time_prev.png); }
#next.disabled, #prev.disabled { opacity: .2; }
</style>
</head>
<body>


<section class="home17_time">
<div class="container">
<h2>发展历程</h2>
<h3>中国第三代网站系统与移动H5技术领导者</h3>
</div>
<div id="timeline">
<ul id="dates" style="width: 740px; margin-left: 140px;">
<li><a href="#" class="">2006</a></li>
<li><a href="#" class="">2008</a></li>
<li><a href="#" class="">2010</a></li>
<li><a href="#" class="">2012</a></li>
<li><a href="#" class="selected">2014</a></li>
<li><a href="#" class="">2016</a></li>
<li><a href="#" class="">2017</a></li>
</ul>
<ul id="issues" style="width: 6900px; margin-left: -2940.06px;">
<li id="2006" class="" style="opacity: 0.2;">
<img src="../examples/z01/images/home17_time1.png">
<strong>千钧立业,扬帆起航。</strong>
<p>2006年2月 逐浪软件江西公司成立 鄱阳湖畔大学城披星戴月。<br>同年即为包括南昌陆军学院、EMKT中国等重点客户提供服务。</p>
</li>
<li id="2008" class="" style="opacity: 0.2;">
<img src="../examples/z01/images/home17_time2.png">
<strong>扬名京师,大道论剑。</strong>
<p>2008年10月 北京中国软件开发者大会 逐浪软件产品精彩亮相。<br>旗下华夏互联、华夏营销网品牌成长迅速。</p>
</li>
<li id="2010" class="" style="opacity: 0.2;">
<img src="../examples/z01/images/home17_time3.png">
<strong>建树军工政务,服务世界五百强。</strong>
<p>
2010年1月 军工领域研发卓越 赢得领导高度赞赏<br>
2011年8月 教育产品线上市 服务15亿教育市场<br>
2011年8月 华夏互联云主机上市 引领大数据开发<br>
2011年9月 OA与办公产品线上市 中国云计算最佳应用实践奖<br>
2011年11月 荣获CSND TOP伙伴荣誉 技术彰显实力
</p>
</li>
<li id="2012" class="" style="opacity: 1;">
<img src="../examples/z01/images/home17_time4.png">
<strong>沪上立业,从江到海的胸怀。</strong>
<p>
2012年元月 逐浪软件上海研发中心成立<br>
2012年3月 上海站长大会精彩纷呈 业界深度交流与认同<br>
2012年4月 阿里云等多家平台邀约结盟 西藏政府多个政务群交付<br>
2012年9月 社会化办公平台上线 开放战略及API2.0<br>
</p>
</li>
<li id="2014" class="selected" style="opacity: 0.2;">
<img src="../examples/z01/images/home17_time5.png">
<strong>立意高远-逐浪软件北京公司成立。</strong>
<p>2014年3月 逐浪软件北京公司成立 北京+上海+南昌三大研发中心<br>
2015年元月 全新一代逐浪云站群发布，引领CMS研发技术<br>
2015年10月 Zoomla!逐浪软件10年周 逐浪字库产品线启动
</p>
</li>
<li id="2016" class="" style="opacity: 0.2;">
<img src="../examples/z01/images/home17_time6.png">
<strong>引领移动互联与大数据时代CMS研发新进程。</strong>
<p>2016年1月 一特网云办公平台上线<br>
2016年2月 动力逐浪全面发布-引领Web开发市场<br>
2016年3月 中国字体网全面上线<br>
2016年7月 全球首发.NET中文MVC网站内容管理系统，再次引领行业发展</p>
</li>
<li id="2017" style="opacity: 0.2;" class="">
<img src="../examples/z01/images/home17_time7.png">
<strong>新征程-12年为壹纪断代凤凰槃涅。</strong>
<p>2017年1月 Zoomla!逐浪®CMS2 3.9.0全新发布<br>
2017年2月 医疗云全面上线<br>
2017年3月 字库大师与字库管家软件交付商用<br>
2017年4月 未来一路风雨征程拓新成就<br>
<a href="https://www.z01.com/corp/history/">More...</a>
</p>
</li>
</ul>
<div id="grad_left"></div>
<div id="grad_right"></div>
<a href="https://www.z01.com/#" id="next">+</a>
<a href="https://www.z01.com/#" id="prev">-</a>
</div>
</section>

<script>
$(function(){
	if($(".container").width()>768){
		$(".home17_time").timelinr({
			autoPlay: 'true',
			autoPlayDirection: 'forward',
			autoPlayPause:5000
		});
	}
});
</script>
</body>
</html>